<template>
  <el-row>
    <el-row>
      <el-form :model="formInline" class="search_prod" label-width="120px">
        <el-form-item label="搜索：">
          <el-col :span="4" class="search_input_width">
            <el-col :span="22">
              <el-input
                size="small"
                clearable
                v-model="search"
                placeholder
              ></el-input>
            </el-col>
          </el-col>
          <el-col :span="4" class="search_input_width">
            <el-col :span="22">
              <el-select v-model="status" size="small" placeholder="搜索类型">
                <el-option
                  v-for="item in searchList"
                  size="small"
                  :key="item.id"
                  :label="item.title"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-col>
          </el-col>
          <el-col :span="4" class="search_input_width">
            <el-col :span="22">
              <el-select
                v-model="formInline.is_check"
                clearable
                size="small"
                placeholder="是否审核"
              >
                <el-option
                  v-for="item in addList"
                  size="small"
                  :key="item.id"
                  :label="item.title"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-col>
          </el-col>
        </el-form-item>
        <el-form-item label="时间：">
          <el-col :span="4" style="width: 260px">
            <el-col :span="22" class="search_time_width">
              <el-date-picker
                style="width: 100%"
                v-model="createTime"
                type="datetimerange"
                size="small"
                align="right"
                unlink-panels
                clearable
                value-format="timestamp"
                range-separator="-"
                start-placeholder="开始时间"
                end-placeholder="结束时间"
                :picker-options="pickerOptions2"
              ></el-date-picker>
            </el-col>
          </el-col>
          <el-col class="tl top_weiy" :span="6" style="top: -1px">
            <el-button
              :loading="$store.state.isLoading"
              size="mini"
              type="primary"
              @click="subOrderInfo"
              >查询</el-button
            >
            <!-- <el-button
              :loading="$store.state.isLoading"
              size="mini"
              type="primary"
              @click="exportExcel"
            >导出</el-button>-->
            <el-button
              :loading="$store.state.isLoading"
              size="mini"
              type="primary"
              @click="delOrderInfo"
              >一键清除</el-button
            >
          </el-col>
        </el-form-item>
      </el-form>
    </el-row>
    <el-row
      class="tl mar_bottom_15"
      style="margin-top: 10px"
    >
      <el-form class="search_prod search_prod1" label-width="120px">
        <el-form-item label="类型：">
          <el-row class="tl mar_bottom_15">
            <el-radio-group
              v-model="cate"
              size="small"
              class="tl money-group"
              @change="changeRadio"
            >
              <el-radio-button
                v-for="(item, i) in formList"
                :label="item.id"
                :key="i"
                >{{ item.title }}</el-radio-button
              >
            </el-radio-group>
          </el-row>
        </el-form-item>
      </el-form>
    </el-row>
  </el-row>
</template>
<script>
import { mapState } from "vuex";
export default {
  name: "bd-msg-search",
  data() {
    return {
      pickerOptions2: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      radio5: "",
      createTime: [],
      formInline: {
        created_time_begin: "",
        created_time_end: "",
        oid: "",
        is_check: "",
      },
      searchList: [
        { id: "username", title: "会员账号" },
        { id: "nickname", title: "用户昵称" },
        { id: "oid", title: "订单号" },
      ],
      addList: [
        { id: "0", title: "未审核" },
        { id: "1", title: "已审核" },
      ],
      moneyList: [],
      rewardList: [],
      cate: "",
      style: "",
      status: "username",
      search: "",
    };
  },
  computed: {
    ...mapState({
      formLists: (state) => state.formList,
      formList() {
        if (this.formLists.length > 0) {
          if (this.$route.query.id) {
            this.cate = this.$route.query.id;
          } else {
            this.cate = this.formLists[0].id;
          }
        }
        return this.formLists;
      },
    }),
  },
  methods: {
    delOrderInfo() {
      this.formInline = {
        created_time_begin: "",
        created_time_end: "",
        oid: "",
        is_check: "",
      };
      if (!this.formInline.id) {
        this.formInline.id = this.cate;
      }
      this.$emit("sendSearch", this.formInline);
    },
    subOrderInfo() {
      this.formInline[this.status] = this.search;
      if (!this.formInline.id) {
        this.formInline.id = this.cate;
      }
      this.$emit("sendSearch", this.formInline);
    },

    exportExcel() {
      var params = JSON.parse(JSON.stringify(this.formInline));
      this.$fnc.postExcelFile(params, "/api/admin/export/money");
    },
    changeRadio() {
      console.log(this.cate);
      this.formInline[this.status] = this.search;
      var params = this.formInline;
      params.id = this.cate;

      this.$emit("sendMoney", params);
    },
  },
  watch: {
    createTime(val) {
      if (val != null) {
        this.formInline.created_time_begin = this.$fnc.phptime(val[0]);
        this.formInline.created_time_end = this.$fnc.phptime(val[1]);
      } else {
        this.formInline.created_time_begin = "";
        this.formInline.created_time_end = "";
      }
    },
    style(val) {
      this.formInline[this.status] = this.search;
      var params = this.formInline;
      params.cate = this.cate;
      params.style = val;
      this.$emit("sendMoney", params);
    },
    status(val) {
      for (var i in this.formInline) {
        for (var j in this.searchList) {
          if (i == this.searchList[j].id && val != this.searchList[j].id) {
            this.formInline[i] = "";
          }
        }
      }
    },
  },
};
</script>
